<template>
	<view>
		<view class="head">
			<view class="checkWeek">
				<img src="http://1.14.247.152:9797/images/19693n2.png" class="zuoCss"
					v-show="selectWeek > 1" @click="weekCut"></img>
				<picker @change="confirmWeek" :value="0" :range="list">
					<button class="title">
						<view class="showWeek">第{{selectWeek}}周</view>
						<view class="weekText" v-if="currentWeek == selectWeek">(本周)</view>
					</button>
				</picker>
				<img src="http://1.14.247.152:9797/images/11940n.png" @click="weekPut"
					v-if="selectWeek < 20" class="youCss"></img>

				<!-- 占位置，防止偏移 -->
				<view v-if="selectWeek >= 20" class="youCss">
				</view>
			</view>
		</view>
		<Timetable :timetables="timetables" :timetableType="timetableType" :xingqiColor="xingqiColor"
			:currentWeek="currentWeek" :selectWeek="selectWeek" @getCourseData="getCourseData">
		</Timetable>
	</view>
</template>
<script>
	import Timetable from '@/components/lpx-timetable/lpx-timetable'
	export default {
		data() {
			return {
				no: '', //
				timetableType: [],
				timetables: [],
				selectWeek: 1,
				currentWeek: 1,
				list: ['1', '2', '3', '4', '5',
					'6', '7', '8', '9', '10',
					'11', '12', '13', '14', '15',
					'16', '17', '18', '19', '20'
				],
				xingqiColor: false,
				himAuthority: "" //觅他de 
			}
		},
		components: {
			Timetable
		},
		async onLoad(option) {
			let vm = this
			this.himAuthority = option.Authority;
			this.miTaIsHaiZhu = option.miTaIsHaiZhu;
			this.no = option.no
			uni.setNavigationBarTitle({
				title: option.name + '的课表'
			});
			let temp
			if (this.miTaIsHaiZhu == "true") {
				temp = [{
						index: '1',
						name: '08:00 08:40'
					},
					{
						index: '2',
						name: '08:50 09:30'
					},
					{
						index: '3',
						name: '09:50 10:30'
					},
					{
						index: '4',
						name: '10:40 11:20'
					},
					{
						index: '5',
						name: ''
					},
					{
						index: '6',
						name: '14:30 15:10'
					},
					{
						index: '7',
						name: '15:20 16:00'
					},
					{
						index: '8',
						name: '16:20 17:00'
					},
					{
						index: '9',
						name: '17:10 17:50'
					},
					{
						index: '10',
						name: '19:30 20:10'
					},
					{
						index: '11',
						name: '20:20 21:00'
					},
					{
						index: '12',
						name: '21:10 21:50'
					}
				]
			} else {
				temp = [{
						index: '1',
						name: '08:40 09:20'
					},
					{
						index: '2',
						name: '09:30 10:10'
					},
					{
						index: '3',
						name: '10:30 11:10'
					},
					{
						index: '4',
						name: '11:20 12:00'
					},
					{
						index: '5',
						name: '     '
					},
					{
						index: '6',
						name: '13:30 14:10'
					},
					{
						index: '7',
						name: '14:20 15:00'
					},
					{
						index: '8',
						name: '15:20 16:00'
					},
					{
						index: '9',
						name: '16:10 16:50'
					},
					{
						index: '10',
						name: '19:00 19:40'
					},
					{
						index: '11',
						name: '19:50 20:30'
					},
					{
						index: '12',
						name: '20:40 21:20'
					}
				]
			}
			vm.timetableType = temp;
			this.loadPage()
		},
		computed: {
			currentXingqi() {
				let xingqi = "7123456".charAt(new Date().getDay());
				return xingqi
			}
		},
		methods: {
			async loadPage() {
				let res = await getApp().UniRequest("/week", "Get", "", "");

				//当前拿到的周还是19，先注释掉
				this.selectWeek = res.data.week;
				this.currentWeek = res.data.week;
				// this.selectWeek = 1
				// this.currentWeek = 1
				this.getCourseData()
			},
			async getCourseData() {
				if (this.selectWeek == this.currentWeek) {
					this.xingqiColor = true
				} else {
					this.xingqiColor = false
				}
				let header = new Object()
				header.Authority = this.himAuthority;

				let body = new Object();
				body.week = this.selectWeek;
				// console.log('week', body.week)
				// console.log('no',this.no)
				uni.showLoading({
					title: '正在加载课表',
					mask: true
				})
				
				let res = await getApp().UniRequest('/mita/authority/course?no=' + this.no + '&week=' + body.week, "Get", body, header);
				console.log('课表', res)
				uni.hideLoading()
				this.timetables = res.data.list
				console.log(this.timetables)
			},
			async weekPut() {
				this.selectWeek++;
				this.getCourseData()
			},
			async weekCut() {
				this.selectWeek--;
				this.getCourseData()
			},
			confirmWeek(res) {
				this.selectWeek = parseInt(res.detail.value) + 1
				this.getCourseData()
			},
		}
	}
</script>
<style lang="less" scoped>
	@color: #86f0be;
	@color_disabled: #f1f1f1;
	@color_standard: #333;
	@color_border: #f5f5f5;
	.head {
		display: flex;
		align-items: center;
		height: 100rpx;
		justify-content: center;
		position: relative;
		border-bottom: 1rpx solid @color_border;
		color: @color_standard;
		background-color: #f5f7fa;
		.left {
			position: absolute;
			left: 20rpx;
		}
		.right {
			// margin-right: 20rpx;
			// display: flex;
			position: absolute;
			right: 20rpx;
		}
		.checkWeek {
			width: 300rpx;
			display: flex;
			align-items: center;
			justify-content: center;
			.zuoCss {
				width: 40rpx;
				height: 40rpx;
				text-align: center;
				margin-right: 10rpx;
			}
			.youCss {
				width: 40rpx;
				height: 40rpx;
				margin-left: 10rpx;
			}
			.title {
				font-size: 30rpx;
				font-weight: bold;
				display: flex;
				justify-content: center;
				align-items: center;
				.weekText {
					font-size: 23rpx;
				}
			}
		}


	}
</style>
